<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Tibetan's Craiglist</title>
<link type="text/css"
	href="<c:url value="/resources/styles/basic_layout.css"/>"
	rel="stylesheet" />
<link type="text/css"
	href="<c:url value="/resources/styles/cupertino/jquery-ui-1.8.16.custom.css"/>"
	rel="stylesheet" />
<link type="text/css"
	href="<c:url value="/resources/styles/navigation/vimeo.css"/>" rel="stylesheet" />	
<script type="text/javascript"
	src="<c:url value="/resources/js/jquery-1.6.2.min.js"/>"></script>
<script type="text/javascript"
	src="<c:url value="/resources/js/jquery-ui-1.8.16.custom.min.js"/>"></script>
</head>
<body>
<div id="div_left"></div>
<div id="div_body">
<div style="float: right; margin-right: 2%;">
<ul id="menu">
	<li class="logo"><img style="float: left;" alt=""
		src="<c:url value="/resources/styles/navigation/image/menu_left.png"/>" />
	<ul id="main">
		<li>Welcome to <b>Create Vimeo-like top navigation</b> tutorial!</li>
		<li class="last"><img class="corner_left" alt=""
			src="<c:url value="/resources/styles/navigation/image/corner_blue_left.png"/>" /> <img class="middle" alt=""
			src="<c:url value="/resources/styles/navigation/image/dot_blue.png"/>" /> <img class="corner_right" alt=""
			src="<c:url value="/resources/styles/navigation/image/corner_blue_right.png"/>" /></li>
	</ul>
	</li>
	<li><a href="#">Login</a></li>
	<li><a href="#">Help</a>
	<ul id="help">
		<li><img class="corner_inset_left" alt=""
			src="<c:url value="/resources/styles/navigation/image/corner_inset_left.png"/>" /> <a href="#">General help</a> <img
			class="corner_inset_right" alt="" src="<c:url value="/resources/styles/navigation/image/corner_inset_right.png"/>" /></li>
		<li><a href="#">Posts</a></li>
		<li><a href="#">Pages</a></li>
		<li class="last"><img class="corner_left" alt=""
			src="<c:url value="/resources/styles/navigation/image/corner_left.png"/>" /> <img class="middle" alt="" src="<c:url value="/resources/styles/navigation/image/dot.gif"/>" />
		<img class="corner_right" alt="" src="<c:url value="/resources/styles/navigation/image/corner_right.png"/>" /></li>
	</ul>
	</li>
	<li class="searchContainer">
	<div><input type="text" id="searchField" /> <img
		src="<c:url value="/resources/styles/navigation/image/magnifier.png"/>" alt="Search"
		onclick="alert('You clicked on search button')" /></div>
	<ul id="search">
		<li><img class="corner_inset_left" alt=""
			src="<c:url value="/resources/styles/navigation/image/corner_inset_left.png"/>" /> <input id="cbxAll" type="checkbox" />All
		<img class="corner_inset_right" alt="" src="<c:url value="/resources/styles/navigation/image/corner_inset_right.png"/>" />
		</li>
		<li><label><input id="Articles" type="checkbox" />Articles</label></li>
		<li><label><input id="Tutorials" type="checkbox" />Tutorials</label></li>

		<li><label><input id="Reviews" type="checkbox" />Reviews</label></li>
		<li><label><input id="Resources" type="checkbox" />Resources</label></li>
		<li class="last"><img class="corner_left" alt=""
			src="<c:url value="/resources/styles/navigation/image/corner_left.png"/>" /> <img class="middle" alt="" src="<c:url value="/resources/styles/navigation/image/dot.gif"/>" />
		<img class="corner_right" alt="" src="<c:url value="/resources/styles/navigation/image/corner_right.png"/>" /></li>
	</ul>

	</li>
</ul>
<img style="float: left;" alt="" src="<c:url value="/resources/styles/navigation/image/menu_right.png"/>" /></div>

<div id="logo">Tibetan Craiglist</div>
<tiles:insertAttribute name="body" /></div>
<div id="div_right"></div>
</body>
</html>